<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>统计数据</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.6/semantic.min.css">
    <style>
        .ui.container {
            padding-top: 1.5rem;
        }

        .ui.container[v-cloak] {
            display: none;
        }
    </style>
</head>
<body id="main">
<div class="ui container"  v-cloak>
    <h2 class="ui dividing blue header">{{questionnaire.title}}</h2>
    <div v-for="(index,question) in questionnaire.questions">
        <h3 class="ui header">{{(index+1)+'. '+question.content}}</h3>

        <div class="ui grid" v-if="question.type==1||question.type==2">
            <div class="six wide right aligned column">
                <div class="row">
                    <div :style="{height: question.options.length * 50 +'px',marginTop: '21px'}">
                        <div v-for="(index,option) in question.options">
                            <div :style="{height: '50px'}">
                                <div :style="{position:'relative',top:'50%',transform:'translateY(-50%)'}">
                                    {{option.content}}({{question.optionsCount==0?0:(Math.round(option.count / question.optionsCount * 100) + '%')}})
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="eight wide column">
                <div class="row" id="{{question._id}}"></div>
            </div>
        </div>
        <div class="ui list" v-if="question.type==3">
            <div class="item" v-for="reply in question.replies">
                {{reply}}
            </div>
        </div>
        <div class="ui divider"></div>
    </div>
</div>
<button type="button" class="ui green button" onclick="a()" style="size: 10rem;">返回首页</button>
<script src="/manage/js/vue.min.js"></script>
<script src="/manage/js/fetch.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<script src="/manage/js/statistics.js"></script>
<script>
    function a(){
    
    
        window.location.href="/index"
    }
    
    </script>
</body>
</html>